#{extends 'main.html' /} #{set title:'Browse all' /}
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Browse All</title>


<script>
	function showThisAndHideAll(toShow) {
		document.getElementById('option').value = "" + toShow;
	}
</script>

<script>
	function showLetterOption(letter) {
		var divToShow = "" + document.getElementById('option').value + letter; 
		var type = document.getElementById('option').value;
		if (document.getElementById(divToShow) == null) {
			if(type == "organizations") {
				javascript:showAllOrganizations(letter);
			} else if(type == "entities") {
				javascript:showAllEntities(letter);
			} else if(type == "topics") {
				javascript:showAllTopics(letter);
			} else if(type == "ideas") {
				javascript:showAllIdeas(letter);
			} else if(type == "tags"){
				javascript:showAllTags(letter);
			}else if(type == "actionPlans") {
				javascript:showAllActionPlans(letter);
			} else {
				javascript:showAllOrganizations(letter);
			}
		} else {
			if(document.getElementById('divToHide').value != divToShow)$("#" + document.getElementById('divToHide').value + "").hide(1000);
			$("#" + divToShow + "").toggle(1000);
			document.getElementById('divToHide').value = divToShow;
		}
	}
</script>

<!-- ---------------------------------------------------------------------------------------------------------------------------------- -->
<!-- -------------------------------------------------------------javascript for browsing organizations-------------------------------- -->

<script type="text/javascript">
    function showAllOrganizations(letter){
    	var user = '${user}';
 	    $.getJSON('@{BrowseController.browseOrganizationsByCharacter()}',{'startingLetter': letter, 'userName': user}, function(data){
 	    if (document.getElementById("organizations" + letter) == null){
 	    	var orgs = data.orgs;
 	        var orgsPart = "<div id=\"organizations" + letter + "\">";
 	    	if(orgs == null || orgs == ""){	
 			orgsPart += "No organizations to show" + "<div>";
 			} else {
 			var x = orgs.split("&&");
 			for(var i = 0; i<x.length-1; i = i+1){
 				var org = "" + x[i];
 			orgsPart +=	"<a href=\"@{Application.organizationView()}?name=" + x[i] +"\">" + x[i] +  "</a></br>";
 			}	
 			}
 	    	if(document.getElementById('divToHide').value != "") $("#" + document.getElementById('divToHide').value + "").hide();
 			document.getElementById('orgsDiv').innerHTML += orgsPart;
 			document.getElementById('option').value = "organizations";
 			document.getElementById('divToHide').value = "organizations" + letter;
 			$("#" + document.getElementById('divToHide').value + "").hide();
 			showLetterOption(letter);	
 	    }
    });
    }
</script>

<!-- ---------------------------------------------------------------------------------------------------------------------------------- -->
<!-- -------------------------------------------------------------javascript for browsing entities------------------------------------- -->

<script type="text/javascript">
    function showAllEntities(letter){
    	var user = '${user}';
 	    $.getJSON('@{BrowseController.browseEntitiesByCharacter()}',{'startingLetter': letter, 'userName': user}, function(data){
 	    if (document.getElementById("entities" + letter) == null){
 	    	var entits = data.entits;
 	        var entitsPart = "<div id=\"entities" + letter + "\">";
 	    	if(entits == null || entits == ""){	
 			entitsPart += "No entities to show" + "<div>";
 			} else {
 			var x = entits.split("&&");
 			for(var i = 0; i<x.length-1; i = i+1){
 			entitsPart +=	"<a href=\"@{Application.entityViewByName}?entityName=" + x[i] +"\">" + x[i] +  "</a></br>";	
 			}	
 			}
 	    	if(document.getElementById('divToHide').value != "") $("#" + document.getElementById('divToHide').value + "").hide();
 			document.getElementById('entitsDiv').innerHTML += entitsPart;
 			document.getElementById('option').value = "entities";
 			document.getElementById('divToHide').value = "entities" + letter;
 			$("#" + document.getElementById('divToHide').value + "").hide();
 			showLetterOption(letter);	
 	    }
    });
    }
</script>

<!-- ---------------------------------------------------------------------------------------------------------------------------------- -->
<!-- -------------------------------------------------------------javascript for browsing topics---------------------------------------- -->
<script type="text/javascript">
    function showAllTopics(letter){
    	var user = '${user}';
 	    $.getJSON('@{BrowseController.browseTopicsByCharacter()}',{'startingLetter': letter, 'userName': user}, function(data){
 	    if (document.getElementById("topics" + letter) == null){
 	    	var topics = data.topics;
 	        var topicsPart = "<div id=\"topics" + letter + "\">";
 	    	if(topics == null || topics == ""){	
 			topicsPart += "No topics to show" + "<div>";
 			} else {
 			var x = topics.split("&&");
 			for(var i = 0; i<x.length-1; i = i+1){
 			var temp = x[i].split("-");	
 			var id = temp[0];
 			var title = temp[1];
 			topicsPart +=	"<a href=\"@{TopicIdeaController.checkAuthorizationToViewTopic()}?topicId=" + id +"\">" + title +  "</a></br>";	
 			}	
 			}
 	    	if(document.getElementById('divToHide').value != "") $("#" + document.getElementById('divToHide').value + "").hide();
 			document.getElementById('topicsDiv').innerHTML += topicsPart;
 			document.getElementById('option').value = "topics";
 			document.getElementById('divToHide').value = "topics" + letter;
 			$("#" + document.getElementById('divToHide').value + "").hide();
 			showLetterOption(letter);	
 	    }
    });
    }
</script>

<!-- ---------------------------------------------------------------------------------------------------------------------------------- -->
<!-- -------------------------------------------------------------javascript for browsing ideas---------------------------------------- -->
<script type="text/javascript">
    function showAllIdeas(letter){
    	var user = '${user}';
 	    $.getJSON('@{BrowseController.browseIdeasByCharacter()}',{'startingLetter': letter, 'userName': user}, function(data){
 	    if (document.getElementById("ideas" + letter) == null){
 	    	var ideas = data.ideas;
 	        var ideasPart = "<div id=\"ideas" + letter + "\">";
 	    	if(ideas == null || ideas == ""){	
 			ideasPart += "No ideas to show" + "<div>";
 			} else {
 			var x = ideas.split("&&");
 			for(var i = 0; i<x.length-1; i = i+1){
 			var temp = x[i].split("-");	
 			var id = temp[0];
 			var title = temp[1];
 			ideasPart +=	"<a href=\"@{TopicIdeaController.checkAuthorizationToViewIdea()}?ideaId=" + id +"\">"  + title +  "</a></br>";	
 			}	
 			}
 	    	if(document.getElementById('divToHide').value != "") $("#" + document.getElementById('divToHide').value + "").hide();
 			document.getElementById('ideasDiv').innerHTML += ideasPart;
 			document.getElementById('option').value = "ideas";
 			document.getElementById('divToHide').value = "ideas" + letter;
 			$("#" + document.getElementById('divToHide').value + "").hide();
 			showLetterOption(letter);	
 	    }
    });
    }
</script>

<!-- ---------------------------------------------------------------------------------------------------------------------------------- -->
<!-- -------------------------------------------------------------javascript for browsing tags---------------------------------------- -->
<script type="text/javascript">
    function showAllTags(letter){
    	var user = '${user}';
 	    $.getJSON('@{BrowseController.browseTagsByCharacter()}',{'startingLetter': letter}, function(data){
 	    if (document.getElementById("tags" + letter) == null){
 	    	var tags = data.tags;
 	        var tagsPart = "<div id=\"tags" + letter + "\">";
 	    	if(tags == null || tags == ""){	
 			tagsPart += "No tags to show" + "<div>";
 			} else {
 			var x = tags.split("&&");
 			for(var i = 0; i<x.length-1; i = i+1){
 			tagsPart +=	"<a href=\"@{BrowseController.TagView()}?tagToRenderName=" + x[i] + "\">" + x[i] + "</a></br>"	
 			}	
 			}
 	    	if(document.getElementById('divToHide').value != "") $("#" + document.getElementById('divToHide').value + "").hide();
 			document.getElementById('tagsDiv').innerHTML += tagsPart;
 			document.getElementById('option').value = "tags";
 			document.getElementById('divToHide').value = "tags" + letter;
 			$("#" + document.getElementById('divToHide').value + "").hide();
 			showLetterOption(letter);	
 	    }
    });
    }
</script>

<!-- ---------------------------------------------------------------------------------------------------------------------------------- -->
<!-- -------------------------------------------------------------javascript for browsing action plans--------------------------------- -->
<script type="text/javascript">
    function showAllActionPlans(letter){
    	var user = '${user}';
 	    $.getJSON('@{BrowseController.browseActionPlansByCharacter()}',{'startingLetter': letter,'userName': user}, function(data){
 	    if (document.getElementById("actionPlans" + letter) == null){
 	    	var actionPlans = data.actionPlans;
 	        var actionPlansPart = "<div id=\"actionPlans" + letter + "\">";
 	    	if(actionPlans == null || actionPlans == ""){	
 			actionPlansPart += "No actionPlans to show" + "<div>";
 			} else {
 			var x = actionPlans.split("&&");
 			for(var i = 0; i<x.length-1; i = i+1){
 			var title = x[i].split("-")[1];
 			var id = x[i].split("-")[0];
 			actionPlansPart +=	"<a href=\"@{ActionPlanController.ActionPlanOrganizer()}?actionPlanId=" + id + "\">" + title + "</a></br>"	
 			}	
 			}
 	    	if(document.getElementById('divToHide').value != "") $("#" + document.getElementById('divToHide').value + "").hide();
 			document.getElementById('actionPlansDiv').innerHTML += actionPlansPart;
 			document.getElementById('option').value = "actionPlans";
 			document.getElementById('divToHide').value = "actionPlans" + letter;
 			$("#" + document.getElementById('divToHide').value + "").hide();
 			showLetterOption(letter);	
 	    }
    });
    }
</script>


</head>
<body>
	<p>
		<a id='organizations' href='#' onclick="showThisAndHideAll('organizations')"> All Organizations</a>
		<a id='entities' href='#' onclick="showThisAndHideAll('entities')">All Entities</a> 
		<a id='topics' href='#'onclick="showThisAndHideAll('topics')"> All Topics</a> 
		<a id='ideas'	href='#' onclick="showThisAndHideAll('ideas')"> All Ideas</a>
		<a id='tags' href='#' onclick="showThisAndHideAll('tags')">All Tags</a>
		<a id='actionPlans' href='#' onclick="showThisAndHideAll('actionPlans')">All Action Plans</a>
	</p>


	<p id="letters" value="hidden">
		<a href='#' onclick="showLetterOption('A')"> A </a> <a href='#'
			onclick="showLetterOption('B')"> B </a> <a href='#'
			onclick="showLetterOption('C')"> C </a> <a href='#'
			onclick="showLetterOption('D')"> D </a> <a href='#'
			onclick="showLetterOption('E')"> E </a> <a href='#'
			onclick="showLetterOption('F')"> F </a> <a href='#'
			onclick="showLetterOption('G')"> G </a> <a href='#'
			onclick="showLetterOption('H')"> H </a> <a href='#'
			onclick="showLetterOption('I')"> I </a> <a href='#'
			onclick="showLetterOption('J')"> J </a> <a href='#'
			onclick="showLetterOption('K')"> K </a> <a href='#'
			onclick="showLetterOption('L')"> L </a> <a href='#'
			onclick="showLetterOption('M')"> M </a> <a href='#'
			onclick="showLetterOption('N')"> N </a> <a href='#'
			onclick="showLetterOption('O')"> O </a> <a href='#'
			onclick="showLetterOption('P')"> P </a> <a href='#'
			onclick="showLetterOption('Q')"> Q </a> <a href='#'
			onclick="showLetterOption('R')"> R </a> <a href='#'
			onclick="showLetterOption('S')"> S </a> <a href='#'
			onclick="showLetterOption('T')"> T </a> <a href='#'
			onclick="showLetterOption('U')"> U </a> <a href='#'
			onclick="showLetterOption('V')"> V </a> <a href='#'
			onclick="showLetterOption('W')"> W </a> <a href='#'
			onclick="showLetterOption('X')"> X </a> <a href='#'
			onclick="showLetterOption('Y')"> Y </a> <a href='#'
			onclick="showLetterOption('Z')"> Z </a>
	</p>

	<div id='orgsDiv'></div>
	<div id='entitsDiv'></div>
	<div id='topicsDiv'></div>
	<div id='ideasDiv'></div>
	<div id='tagsDiv'></div>
	<div id='actionPlansDiv'></div>
	<input id='option' type="hidden" value="organizations"/>
	<input id='divToHide' type="hidden" value=""/>

</body>
</html>